$(function () {


    console.log($('#zl-tb td').find('.btn1'))

    var oTime = $('.time')
    var oBtn = $('#zl-btn');
    var aCheckbox = $('.ipt1');
    var oBtn1 = $('.btn1');
    var oBtn2 = $('#zl-btn2');
    var oBtn3 = $('#zl-btn3');
    var oTable = $('#zl-tb tbody');
    var iNp1 = $('#zl-inp');
    var iNp2 = $('#zl-inp1');
    var iNp3 = $('#zl-inp2');
    var iNp4 = $('#zl-inp3');
    var oDiv1 = $('#zl-d5');
    var oBtn5=$('#btn2');
    var oBtn6=$('.btn2');
    var oDiv2= $('#zl-d6');
    var oBtn7=$('#btn3');

    var oBtn8=$('#btn4');
    // // console.log(oDate.getFullYear())
    // console.log(oDate)
    function clock() {
        var oDate = new Date();
        var y = oDate.getFullYear();
        var M = oDate.getMonth() + 1;
        var d = oDate.getDate();
        var h = oDate.getHours();
        var m = oDate.getMinutes();
        var s = oDate.getSeconds();
        oTime.html(y + "年" + M + "月" + d + "日 " + h + ":" + m + ":" + s)
    }

    setInterval(clock, 1000);
//全选
    oBtn.click(
        function () {
            var checked = $('input:checkbox')
            for (var i = 0; i < checked.length; i++) {
                checked[i].checked = true;
            }//全选
        });
//选中删除
    oBtn2.click(function () {
        var checked = $('input:checkbox');
        for (var i = 0; i < checked.length; i++) {
            if (checked.eq(i).prop('checked')) {
                checked.eq(i).parent().parent().remove()
            }
        }
    });
//存取
    /*var json=localStorage.getItem("aa")?JSON.parse(localStorage.getItem("aa"))||[
        {"name":"dd","person":44,"tel":55,"imf":44,"type":1},
        {"name":"dd","person":44,"tel":55,"imf":44,"type":1},
        {"name":"dd","person":44,"tel":55,"imf":44,"type":1},
    ];

    var str=JSON.stringify(json);
    localStorage.setItem('data',str);*/
//添加
    oBtn3.click(function () {

        var oTr = document.createElement('tr');
        oTr.style.className = 'tr1'

        oTr.innerHTML = `<td>${iNp1.val()}</td><td class="td3">${iNp2.val()}</td><td class="td4">${iNp3.val()}</td><td class="td2">${iNp4.val()}</td>
                <td><input class="ipt1" type="checkbox" ></td>
                <td class="td1">
                <button class="btn btn-default btn-xs" data-aaa="A"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span>详情</button>
                <button class="btn btn-default btn-xs" data-aaa="A"> <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>编辑</button>
                <button class="btn btn-default btn-xs remove" data-aaa="A"> <span class="glyphicon glyphicon-remove-sign " aria-hidden="true"></span>删除</button>
            </td></tr>`;
        oTable.append(oTr);
        iNp1.val(null)
        iNp2.val(null);
        iNp3.val(null);
        iNp4.val(null);

    })
//单个删除
    $(function () {
        oTable.on("click", '.remove', function (event) {
            var target = $(event.target);
            target.parent().parent().remove();
        })
    })

    oBtn1.click(
        function () {

            oDiv1.css({'display': 'block'});

        }
    )
    oBtn5.click(function(){
        oDiv1.css({'display': 'none'});
    })
    oBtn6.click(
        function () {

            oDiv2.css({'display': 'block'});

        }
    )
    oBtn7.click(function(){
        oDiv2.css({'display': 'none'});
    })
    oBtn8.click(function(){
        oDiv2.css({'display': 'none'});
    })
});